<template>
    <enjoy-drawer :visible.sync="isShow" :title="$t('defectIncoming.oldVersionApproval')" @close="handleClose" center top="14vh" width="956px" append-to-body :fullscreen="fullscreen">
        <el-form :model="queryParams" size="small" :inline="true" label-suffix=":" ref="detailForm" label-width="100px">
            <el-row>
                <el-form-item :label="$t('inventoryManagement.supplierBatchNo')" prop="lichn">
                    <el-input v-model="queryParams.lichn" :placeholder="
              $t('public.placeholder', {
                placeholder: $t('inventoryManagement.supplierBatchNo')
              })
            " clearable size="small" @keyup.enter.native="handleQuery" />
                </el-form-item>
                <el-form-item :label="$t('inventoryManagement.batch')" prop="lot">
                    <el-input v-model="queryParams.lot" :placeholder="
              $t('public.placeholder', {
                placeholder: $t('inventoryManagement.batch'),
              })
            " clearable size="small" @keyup.enter.native="handleQuery" />
                </el-form-item>
                <el-form-item :label="$t('inventoryManagement.materialNo')" prop="materialCode">
                    <el-input v-model="queryParams.materialCode" :placeholder="
              $t('public.placeholder', {
                placeholder: $t('inventoryManagement.materialNo')
              })
            " clearable size="small" />
                </el-form-item>
                <el-form-item :label="$t('inventoryManagement.supplierNo')" prop="supplierCode">
                    <el-input v-model="queryParams.supplierCode" :placeholder="
              $t('public.placeholder', {
                placeholder: $t('inventoryManagement.supplierNo')
              })
            " clearable size="small" />
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" class="query" icon="el-icon-search" size="mini" @click="handleQuery">{{$t('public.query')}}</el-button>
                    <el-button icon="el-icon-refresh" class="resectBtn" size="mini" @click="resetQuery">{{$t('public.reset')}}</el-button>
                </el-form-item>
            </el-row>
            <el-table stripe :data="typeList" class="edit-table" max-height="350" border>
                <!-- 序号-->
                <el-table-column :label="$t('public.serialNum')" type="index" width="55" align="center" />
                <el-table-column :label="$t('inventoryManagement.supplierBatchNo')" align="left" prop="lichn" />
                <el-table-column :label="$t('inventoryManagement.batch')" align="left" prop="lot" />
                <el-table-column :label="$t('inventoryManagement.materialNo')" align="left" prop="materialCode" />
                <el-table-column :label="$t('inventoryManagement.supplierNo')" align="left" prop="supplierCode" />
                <el-table-column :label="$t('processDefinition.version')" align="left" prop="version" />
                <el-table-column :label="$t('public.opera')" fixed="right" align="center" width="160">
                    <template slot-scope="scope">
                        <div class="action-wrap">
                            <table-body-btn type="gwview" :name="$t('home.view')" @click.native="handleView(scope.row)" />
                            <table-body-btn type="gwedit" :name="$t('inventoryManagement.approval')" @click.native="oldVersionApproval(scope.row)" />
                        </div>
                    </template>
                </el-table-column>
            </el-table>
            <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" layout="total, sizes, prev, pager, next, jumper" />
        </el-form>
        <div slot="footer">
            <el-button @click="$emit('update:visible',false)" icon="el-icon-close" size="small">{{$t('public.close')}}</el-button>
        </div>

        <el-dialog :title="$t('inventoryManagement.approval')" :visible.sync="approvalVisible" center width="40%" append-to-body>
            <el-form :model="queryParams" ref="approvalModel" v-model="approvalModel" label-position="top">
                <el-form-item :label="$t('inventoryManagement.approval')" prop="oldVersionStatus">
                    <el-radio-group v-model="approvalModel.oldVersionStatus" class="smallRadio">
                        <el-radio label="1">{{
                $t("inventoryManagement.pass")
              }}</el-radio>
                        <el-radio label="0">{{
                $t("inventoryManagement.reject")
              }}</el-radio>
                    </el-radio-group>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" @click="submitApproval" icon="el-icon-check" size="small">{{ $t("public.define") }}</el-button>
            </div>
        </el-dialog>
        <el-dialog :title="$t('inventoryManagement.detail')" :visible.sync="isHide" center width="100%" append-to-body>
            <incoming-info v-if="isHide" :rowId="rowItem.id" @closeIncomingInfo="isHide = false"></incoming-info>
        </el-dialog>
    </enjoy-drawer>
</template>

<script>
import EnjoyDrawer from '@/components/EnjoyDrawer'
import {
    getOldVersionList,
    editoldVersion,
} from '@/api/inspectionManagement/inspectionManagement'
import { inventoryApprove } from '@/api/inventoryManagement/inspectedInventory'
import incomingInfo from '../incomingDetail'
export default {
    name: 'oldVersionDrawer',
    components: {
        EnjoyDrawer,
        incomingInfo,
    },
    props: {
        value: {
            type: Object,
        },
        visible: {
            type: Boolean,
            default: false,
        },
        type: [String, Number], //1:新增  2：编辑 3：查看
    },
    watch: {
        visible(val) {
            if (val) {
                this.queryParams.pageSize = 20
                this.getList()
            }
        },
    },
    computed: {
        isShow: {
            get() {
                return this.visible
            },
            set() {
                this.$emit('update:visible', false)
            },
        },
    },
    data() {
        return {
            loading: false,
            fullscreen: false,
            deviceOptions: undefined,
            factoryOptions: undefined,
            minVisible: false,
            typeList: [],
            queryParams: {
                pageNum: 1,
                pageSize: 20,
                lichn: '',
                supplierCode: '',
                lot: '',
                materialCode: '',
            },
            approvalModel: {
                oldVersionStatus: '0',
                id: '',
            },
            rowMinData: {},
            total: 0,
            approvalVisible: false,
            rowItem: {},
            isHide: false,
        }
    },
    methods: {
        getList() {
            getOldVersionList(this.queryParams).then((res) => {
                if (res.code == 200) {
                    this.typeList = res.rows
                    this.total = res.total
                }
            })
        },
        /** 搜索按钮操作 */
        handleQuery() {
            this.queryParams.pageNum = 1
            this.getList()
        },
        /** 重置按钮操作 */
        resetQuery() {
            this.resetForm('detailForm')
            this.handleQuery()
        },
        handleClose(done) {
            this.$emit('update:visible', false)
            this.queryParams.pageSize = 20
        },
        oldVersionApproval(row) {
            this.approvalModel.id = row.id
            this.approvalVisible = true
        },
        submitApproval() {
            editoldVersion(this.approvalModel).then((response) => {
                this.approvalVisible = false
                this.$modal.msgSuccess('审批成功')
                this.getList()
            })
        },
        handleView(row) {
            this.rowItem.id = row.id
            this.isHide = true
        },
    },
}
</script>

<style scoped>
::v-deep .query {
    background: #20b09f;
    border-color: #20b09f;
}
.table-add {
    text-align: center;
    font-size: 12px;
    color: #666;
    padding: 7px;
    border: 1px solid #e3e8ee;
    border-top: 0;
    cursor: pointer;
}
.table-add:hover {
    color: #004d8c;
}
</style>
